<!DOCTYPE html>
<html lang="zh-CN">

<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<title>首页</title>
	<style>
		*,
		*::after,
		*::before {
			margin: 0;
			padding: 0;
			box-sizing: border-box;
		}

		:root {
			min-height: 100vh;
		}

		:root:focus-within {
			scroll-behavior: smooth;
		}

		body {
			min-height: inherit;
		}
	</style>
</head>

<body>
	<!--
    <template>
	<view class="content">
		<form @submit="submit" class="form">
			<input type="text" name="name" v-model.trim="name" placeholder="请输入姓名" />
			<input type="text" name="txt" v-model.trim="txt" placeholder="请输入内容">
			<button class="subBtn" form-type="submit">发送</button>
		</form>
	</view>
</template>

<script setup lang="ts">
	import { onLoad } from "@dcloudio/uni-app"
	import { onUnmounted, reactive, ref, getCurrentInstance } from "vue"

	let name = ref("")
	let txt = ref("")
	// 连接Socket服务
	uni.connectSocket({
		url: "ws://127.0.0.1:9090",
		success: res => console.log(res.errMsg),
		fail: err => console.error(err)
	})
	uni.onSocketOpen(() => {
		console.log('WebSocket连接已打开！')
	})
	uni.onSocketError(() => {
		console.error('WebSocket连接打开失败，请检查！')
	})
	// 接受服务器发生的消息
	uni.onSocketMessage(res => {
		console.log("接受服务器返回的消息", res)
	})

	// 提交表单
	let submit = e => {
		let { name = "", txt = "" } = e.detail.value
		if (!name) return void console.log("请输入姓名")
		if (!txt) return void console.log("请输入内容")

		uni.sendSocketMessage({
			data: JSON.stringify(e.detail.value)
		})
	}

	onUnmounted(() => {
		uni.closeSocket({
			success() {
				console.log("关闭成功了")
			},
			fail() {
				console.error("关闭失败了")
			}
		})
	})
</script>

<style lang="scss" scoped>
	input {
		padding: 10rpx;
		border: 1rpx solid #f8f8f8;
		margin-bottom: 10rpx;
	}

	.subBtn {
		border: none;

		&::after {
			content: none;
		}
	}
</style>
-->
</body>
<script>
	"use strict"; {

	};
</script>

</html>